<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="styles.css">
    <link rel="stylesheet" href="https://unpkg.com/boxicons@latest/css/boxicons.min.css">
    <title>Business Card with Colored Social Icons and QR Code</title>
</head>
<body>
    <body>
        <div class="business-card">
            <div class="card-header">
                <img src="img1.png" alt="Profile Picture">
                <h1>Your Name</h1>
                <p>Job Title</p>
            </div>
            <div class="card-details">
                <p>Email: your@email.com</p>
                <p>Phone: (123) 456-7890</p>
                <p>Website: www.yourwebsite.com</p>
                <p>Address: 123 Main St, City, Country</p>
            </div>
            <div class="social-media">
                <a href="https://www.linkedin.com/in/yourprofile" target="_blank">
                    <i class='bx bxl-linkedin'></i>
                </a>
                <a href="https://github.com/yourprofile" target="_blank">
                    <i class='bx bxl-github'></i>
                </a>
                <a href="https://twitter.com/yourprofile" target="_blank">
                    <i class='bx bxl-twitter'></i>
                </a>
                <a href="https://www.facebook.com/yourprofile" target="_blank">
                    <i class='bx bxl-facebook'></i>
                </a>
                <a href="https://www.instagram.com/yourprofile" target="_blank">
                    <i class='bx bxl-instagram'></i>
                </a>
            </div>
            <div class="contact-btn">
                <a href="mailto:your@email.com">Contact Us</a>
            </div>
        </div>
        </div>
    </div>
</body>
</html>
